<template>
  <div class="add-legal-coin">
    <el-dialog
      :title="visible.type===0? '添加计价货币':'修改计价货币'"
      :visible.sync="visible.showSetDialog"
      @open="getCoins"
      width="400px"
      center
      :close-on-click-modal="false"
    >
      <div class="content">
        <div class="line flex-left">
          <label class="title">货币名称</label>
          <el-select v-model="param.currency_id" placeholder="请选择" size="medium">
            <el-option
              v-for="(item,index) in coinList"
              :key="index"
              :label="item.pj_name"
              :value="item.id"
            ></el-option>
          </el-select>
        </div>
        <div class="line flex-left">
          <label class="title">排序</label>
          <el-input v-model.number="param.sort" size="medium" placeholder="请输入货币排序"></el-input>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="visible.showSetDialog = false">取 消</el-button>
        <el-button
          size="small"
          type="primary"
          @click="submit"
          :disabled="onSubmit"
          :loading="onSubmit"
        >确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  addLegalCoin,
  supLegalCoin
} from "../../views/WalletManage/Wallet.service.js";
export default {
  props: ["visible", "platform_id"],
  data() {
    return {
      param: {
        platform_id: "",
        currency_id: "",
        sort: ""
      },
      coinList: [],
      onSubmit: false
    };
  },
  watch: {
    visible: {
      handler(item) {
        this.param.platform_id = Number(this.platform_id);
        if (item.type === 1) this.param = { ...this.param, ...item.data };
        if (item.showSetDialog === false)
          this.param = {
            platform_id: "",
            currency_id: "",
            sort: ""
          };
      },
      deep: true
    }
  },
  methods: {
    async submit() {
      const res = await addLegalCoin(this.param);
      if (res.code === 0) {
        this.$notify.success({
          title: "提示",
          message: this.visible.type === 0 ? "添加成功" : "修改成功"
        });
        this.$emit("success");
      }
    },
    async getCoins() {
      const res = await supLegalCoin();
      this.coinList = res.data.items || [];
    }
  }
};
</script>

<style lang="scss">
.add-legal-coin {
  .el-dialog__header {
    border-bottom: 1px solid #e9e9e9;
    padding: 15px;
    font-weight: 600;
  }
  .content {
    .line {
      // height: 60px;
      margin-bottom: 20px;
      .title {
        width: 5em;
        text-align: right;
        margin-right: 20px;
        flex-shrink: 0;
      }
    }
  }
}
</style>